<template>
  <div>
    <navigation-bar>
      <div class="searchContent">
        <el-input v-model="examineeName" placeholder="请输入名称" size="mini"
          style="width: 150px; margin-right: 10px"></el-input>
        <custom-button type="search" style="margin-right: 10px" @searchClick="searchClick"></custom-button>
        <custom-button type="reset" style="margin-right: 10px" @resetClick="resetClick"></custom-button>
        <custom-button type="add" style="margin-right: 10px" @addClick="addClick"></custom-button>
      </div>
    </navigation-bar>
    <el-row>
      <el-col :span="5">
        <div style="width: 100%">
          <user-list @handleSelectionChange="handleSelectionChange" stage="in" businessType="inquiryRecord" ref="userList"
            @addClick="addClick"></user-list>
        </div>
      </el-col>
      <el-col :span="19">
        <table-index :dataSource="dataSource" :tableColumns="tableColumns" :btnList="btnList" :pageSize="pageSize"
          :pageCount="pageCount" :pageNo="pageNo" @pageChange="pageChange" @editRow="editRow" @viewRow="viewRow"
          @deleteRow="deleteRow"></table-index>
      </el-col>
    </el-row>
    <div v-if="dialogShow">
      <custom-dialog :title="dialogTitle" size="large" @dialogClose="dialogClose">
        <form-index :formConfig="formConfig" @submit="submit" :type="type">
          <div style="height: 300px">
            <navigation-bar customTitle="问卷调查">
              <custom-button style="margin-right: 10px" type="add" :title="`一键【` + changeOptionLabe(item.label) + `】`"
                @addClick="createDefault(item.value)" v-for="(item, index) in defaultList" v-bind:key="index">
              </custom-button>
            </navigation-bar>
            <div style="margin-top: 10px">
              <el-table :data="contentData" border style="width: 100%" :row-style="{ height: '40px' }"
                :cell-style="{ padding: '0' }" height="260">
                <el-table-column label="序号" align="center" width="60" fixed>
                  <template slot-scope="scope">
                    {{ scope.$index + 1 }}
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="问诊项" align="center">
                </el-table-column>
                <el-table-column prop="explains" label="说明" align="left">
                </el-table-column>
                <el-table-column prop="optionsResult" label="问诊结果" align="center">
                  <template slot-scope="scope">
                    <slot :name="scope.row.optionsResult" :params="scope.row">
                      <el-select v-model="scope.row.optionsResult" placeholder="请选择" @change="(e) => {
                        changeOptions(e, scope.row)
                      }
                        ">
                        <el-option v-for="item in getOptionValue(scope.row.options)" :key="item.value"
                          :label="changeOptionLabe(item.label)" :value="item.value">
                        </el-option>
                      </el-select>
                    </slot>
                  </template>
                </el-table-column>
                <el-table-column prop="inquiryItemRemarks" label="问诊备注" align="center">
                  <template slot-scope="scope">
                    <slot :name="scope.row.inquiryItemRemarks" :params="scope.row">
                      <el-input style="width: 180px" size="small" v-model="scope.row.inquiryItemRemarks" @change="(e) => {
                        remarkChange(e, scope.row)
                      }
                        ">
                      </el-input>
                    </slot>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </form-index>
      </custom-dialog>
    </div>
  </div>
</template>

<script>
import { inquiriesCheckForm } from '@/assets/form/managementCenter/subjectManagement/occupancyManagement/inquiriesCheckForm'
import customDialog from '@/components/customComponents/customDialog'
import customButton from '@/components/customComponents/customForm/customButton'
import formIndex from '@/components/customComponents/customForm/formIndex'
import tableIndex from '@/components/customComponents/customeTable/tableIndex'
import navigationBar from '@/components/customComponents/managementCenter/navigationBar'
import userList from '@/components/customComponents/managementCenter/userList'
import { AjaxCommon } from '@/libs/apiCommon'
import { PopupCommon } from '@/libs/popupCommon'
import { SessionCommon } from '@/libs/sessionCommon'
import { Utility } from '@/libs/utility'
export default {
  components: {
    navigationBar,
    customButton,
    tableIndex,
    customDialog,
    formIndex,
    userList,
  },
  data() {
    return {
      // 一键默认
      defaultList: [],
      selectList: Utility.getDictList('select_option'),
      examineeCodeList: [],
      contentData: [],
      leftSelectIds: [],
      leftDataSource: [],
      leftTableColumns: [
        {
          prop: 'examineeName',
          label: '受试者姓名',
        },
      ],
      examineeName: '',
      // table 相关参数  begin
      dataSource: [],
      tableColumns: [
        {
          prop: 'filterNo',
          label: '筛选号',
          width: 80,
        },
        {
          prop: "randomNo",
          label: "随机号",
          width: 80,
        },
        {
          prop: "groupSeq",
          label: "入组顺序号",
          width: 100,
        },
        {
          prop: 'examineeName',
          label: '受试者姓名',
          width: 100,
        },
        {
          prop: 'sex',
          label: '性别',
          dictName: 'sex',
          width: 60,
        },
        {
          prop: 'createByName',
          label: '记录人',
          width: 100,
        },
        {
          prop: 'createTime',
          label: '记录时间',
          width: 160,
        },
        {
          prop: 'remarks',
          label: '调查备注',
        },
      ],
      btnList: ['edit', 'view', 'delete'],
      pageSize: 20,
      pageCount: 100,
      pageNo: 1,
      // table 相关参数  end

      // 弹窗是否显示
      dialogShow: false,
      // 弹窗标题 (新增修改不同)
      dialogTitle: '',

      // form的配置信息
      formConfig: inquiriesCheckForm,
      type: 'add',
    }
  },
  methods: {
    remarkChange(e, row) {
      let curDataList = this.contentData
      curDataList.map((t) => {
        if (t.id == row.id) {
          t.inquiryItemRemarks = e
        }
        return t
      })
      this.contentData = curDataList
    },
    changeOptions(e, row) {
      let curDataList = this.contentData
      curDataList.map((t) => {
        if (t.id == row.id) {
          t.optionsResult = e
        }
        return t
      })
      let newData = [].concat(curDataList)
      this.contentData = newData
    },
    getOptionValue(items) {
      let options = []
      if (items) {
        const itemTemp = items.split(',')
        options = this.selectList.filter((t) => itemTemp.includes(t.value))
      }
      return options
    },
    changeOptionLabe(label) {
      return label
    },
    createDefault(value) {
      // 一键默认
      let curDataList = this.contentData
      curDataList.map((t) => {
        t.optionsResult = value
        return t
      })
      let newData = [].concat(curDataList)
      this.contentData = newData
    },
    submit(d) {
      let self = this
      let addData = {}
      if (this.type == 'add') {
        addData.examineeCode = self.leftSelectIds[0].examineeCode
        addData.remark = d.remarks
      } else {
        addData.examineeCode = d.examineeCode
        addData.remark = d.remarks
        addData.optReason = d.optReason
      }

      addData.commonList = this.contentData

      AjaxCommon('/ccdc/pm/em/in/emInInquiryRecord/add', 'post', addData)
        .then((res) => {
          if (res.data.code == 200) {
            PopupCommon.notify('success', '操作成功')
            self.initPage()
            self.dialogClose()
            this.$refs.userList.refresh()
          } else {
            PopupCommon.notify('error', res.data.message)
          }
        })
        .catch((err) => {
          PopupCommon.notify('error', err.message)
        })
    },
    dialogClose() {
      this.dialogShow = false
      this.$refs.userList.handleClearTableRow()
    },
    searchClick() {
      this.pageNo = 1
      this.initPage()
    },
    resetClick() {
      this.examineeName = ''
    },
    addClick() {
      if (this.leftSelectIds.length != 1) {
        PopupCommon.notify('info', '请勾选一个受试者')
        return
      }
      let formConfigItem = this.formConfig
      console.log(this.leftSelectIds[0], 'd..............')
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == 'fieldName') {
            if (t[res] == 'examineeCode') {
              t.filedValue = this.leftSelectIds[0].examineeCode
              this.examineeCode = t.filedValue
            } else if (t[res] == 'examineeName') {
              t.filedValue = this.leftSelectIds[0].examineeName
            } else if (t[res] == 'filterNo') {
              t.filedValue = this.leftSelectIds[0].filterNo
            } else if (t[res] == 'randomNo') {
              t.filedValue = this.leftSelectIds[0].randomNo
            } else if (t[res] == 'groupSeq') {
              t.filedValue = this.leftSelectIds[0].groupSeq
            } else {
              t.filedValue = ''
            }
          }
        })
      })
      formConfigItem.groupId = this.leftSelectIds[0].id
      this.formConfig = formConfigItem

      this.type = 'add'
      this.dialogShow = true
      this.dialogTitle = Utility.getTitle('编辑', JSON.parse(SessionCommon.getCurrentMenuInfo()).title, this.leftSelectIds[0]);
      let self = this
      //加载问诊题目信息
      AjaxCommon('/ccdc/pm/em/in/emInInquiryRecord/listRecord', 'post', {
        examineeCode: this.examineeCode,
      })
        .then((res) => {
          if (res.data.code == 200) {
            const data = res.data.result
            if (data.length > 0) {
              self.defaultList = []
              let allOptions = []
              data.forEach((b) => {
                // updby hsy 需要传入配置id以此补录数据
                b.configId = b.id
                const option = b.options.split(',')
                if (option.length > 0 && allOptions.length == 0) {
                  allOptions = allOptions.concat(option)
                } else {
                  var arr3 = option.filter((item) => {
                    return allOptions.includes(item)
                  })
                  allOptions = arr3
                }
              })
              allOptions = Array.from(new Set(allOptions))
              allOptions.forEach((c) => {
                self.defaultList.push({
                  label: self.selectList.find((d) => d.value == c).label,
                  value: c,
                })
              })
            }
            self.contentData = data
          } else {
            PopupCommon.notify('error', res.data.message)
          }
        })
        .catch((err) => {
          PopupCommon.notify('error', err.message)
        })
    },
    // 分页点击事件
    pageChange(p) {
      this.pageNo = p
      this.initPage()
    },
    editRow(d) {
      console.log(d, 'd..............')
      this.type = 'edit'
      let formConfigItem = this.formConfig
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == 'fieldName') {
            if ('questionnaireItemRemarks' == t[res]) {
              t.filedValue = d.data.remarks
            } else {
              t.filedValue = d.data[t[res]]
            }
          }
        })
      })
      this.formConfig = formConfigItem
      this.dialogShow = true
      this.dialogTitle = Utility.getTitle('编辑', JSON.parse(SessionCommon.getCurrentMenuInfo()).title, d.data);
      let self = this
      AjaxCommon(
        '/ccdc/pm/em/in/emInInquiryRecord/listByRecordResult',
        'post',
        {
          examineeCode: d.data.examineeCode,
          createTime: d.data.createTime,
        }
      ).then((res) => {
        if (res.data.code == 200) {
          const data = res.data.result.commonList
          if (data.length > 0) {
            self.defaultList = []
            let allOptions = []
            data.forEach((b) => {
              const option = b.options.split(',')
              if (option.length > 0 && allOptions.length == 0) {
                allOptions = allOptions.concat(option)
              } else {
                var arr3 = option.filter((item) => {
                  return allOptions.includes(item)
                })
                allOptions = arr3
              }
            })
            allOptions = Array.from(new Set(allOptions))
            allOptions.forEach((c) => {
              self.defaultList.push({
                label: self.selectList.find((d) => d.value == c).label,
                value: c,
              })
            })
          }
          self.contentData = data
        } else {
          PopupCommon.notify('error', res.data.message)
        }
      })
    },
    viewRow(d) {
      console.log(d, 'd..............')
      this.type = 'look'
      let formConfigItem = this.formConfig
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == 'fieldName') {
            if ('questionnaireItemRemarks' == t[res]) {
              t.filedValue = d.data.remarks
            } else {
              t.filedValue = d.data[t[res]]
            }
          }
        })
      })
      this.formConfig = formConfigItem
      this.dialogShow = true
      this.dialogTitle =
        '查看' + JSON.parse(SessionCommon.getCurrentMenuInfo()).title
      let self = this
      AjaxCommon(
        '/ccdc/pm/em/in/emInInquiryRecord/listByRecordResult',
        'post',
        {
          examineeCode: d.data.examineeCode,
          createTime: d.data.createTime,
        }
      ).then((res) => {
        if (res.data.code == 200) {
          const data = res.data.result.commonList
          if (data.length > 0) {
            self.defaultList = []
            let allOptions = []
            data.forEach((b) => {
              const option = b.options.split(',')
              if (option.length > 0 && allOptions.length == 0) {
                allOptions = allOptions.concat(option)
              } else {
                var arr3 = option.filter((item) => {
                  return allOptions.includes(item)
                })
                allOptions = arr3
              }
            })
            allOptions = Array.from(new Set(allOptions))
            allOptions.forEach((c) => {
              self.defaultList.push({
                label: self.selectList.find((d) => d.value == c).label,
                value: c,
              })
            })
          }
          self.contentData = data
        } else {
          PopupCommon.notify('error', res.data.message)
        }
      })
    },
    deleteRow(d) {
      let self = this
      AjaxCommon('/ccdc/pm/em/in/emInInquiryRecord/delete', 'post', {
        examineeCode: d.data.examineeCode,
        createTime: d.data.createTime,
      }).then((res) => {
        if (res.data.code == 200) {
          PopupCommon.notify('success', '删除成功')
          self.initPage()
          self.dialogClose()
          this.$refs.userList.refresh()
        } else {
          PopupCommon.notify('error', res.data.message)
        }
      })
    },
    // 左侧选中事件
    handleSelectionChange(d) {
      this.leftSelectIds = d
      this.examineeCodeList = d ? d.map((t) => t.examineeCode) : []
      this.initPage()
    },
    // 初始化事件
    initPage() {
      let self = this
      AjaxCommon('/ccdc/pm/em/in/emInInquiryRecord/listByPage', 'post', {
        examineeName: this.examineeName,
        examineeCodeList: this.examineeCodeList,
        pageNo: this.pageNo,
        pageSize: this.pageSize,
      }).then((res) => {
        if (res.data.code == 200) {
          self.dataSource = res.data.result.records
          self.pageCount = res.data.result.total
        } else {
          PopupCommon.notify('error', res.data.message)
        }
      })
    },
  },
  mounted() {
    this.initPage()
  },
}
</script>

<style></style>
